<template>
  <main-layout v-bind:headerContent="title" class="page404">
    <flex-center>
      <el-result icon="info" title="404" v-bind:subTitle="count + 's'">
      </el-result>
    </flex-center>
  </main-layout>
</template>

<script>
import MainLayout from "../layout/Main.vue";
import FlexCenter from "../layout/FlexCenter.vue";
export default {
  components: {
    MainLayout,
    FlexCenter,
  },
  created() {
    this.waitToHome();
  },
  data() {
    return {
      title: "你不该来这",
      count: "",
    };
  },
  methods: {
    waitToHome() {
      const TIME_COUNT = 2;
      if (!this.timer) {
        this.count = TIME_COUNT;
        this.show = false;
        this.timer = setInterval(() => {
          if (this.count > 0 && this.count <= TIME_COUNT) {
            this.count--;
          } else {
            this.show = true;
            clearInterval(this.timer);
            this.timer = null;
            //跳转的页面写在此处
            this.$router.push("/");
          }
        }, 1000);
      }
    },
  },
};
</script>

<style>
.page404 {
  background: #e7fae7 url("../assets/593257.jpg") repeat fixed center;
}
</style>
